<style lang="sass" scoped>
    .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td{
        vertical-align: middle;
    }
    .h-search{
        vertical-align: middle;
        line-height: 15px;
    }
    .comm_content_top{
        .brank_nav{
            float: left
        }
        .search{
        }
    }
    .vb{
        vertical-align: bottom;
    }
    .com-block{
        background: #fff;
        padding:15px;
        margin-top:20px;
        // 通用样式
        .form-content{
            clear:both;
            .content-group{
                width: 450px;
                float:left;
                margin-bottom: 10px;
                clear:both;
                .label-group{
                    height: 33px;
                    float: left;
                    width: 80px;
                }
                .input-groups{
                    margin-left:20px;
                    width: 350px;
                    float: left;
                    .headimgurl{
                        display:inline-block;
                        width:120px;
                    }
                    .product-label{
                        width: 120px;
                        margin-right: 10px;
                        height: 30px;
                        line-height: 30px;
                        background-color: #fafafa;
                        border: 1px solid #d6dee3;
                        display: block;
                        float: left;
                        cursor: pointer;
                        text-align: center;
                        &.active{
                            background-color: #5974d9 !important;
                            color:#fff;
                        }
                    }
                }
            }
        }
    }
</style>

<template>
<div class="container-fluid">
    <div class="comm_content_top clearfix">
        <nav-bar>
            <li slot="nav_two">商品管理</li>
        </nav-bar>
    </div>
    <div class="com-block clearfix">
        <div class="form-content">
            <div class="content-group clearfix">
                <div class="label-group clearfix">
                    <span class='float-right'>头像：</span>
                </div>
                <div class='input-groups'>
                    <img class="headimgurl" :src="dataInfo.headimgurl | imgBaseUrl">
                    <button
                        @click="upload()" 
                        class="btn btn-primary inline_block vb ml10">修改头像</button>
                </div>
            </div>
            <div class="content-group clearfix">
                <div class="label-group clearfix">
                    <span class='float-right'>昵称：</span>
                </div>
                <div class='input-groups'>
                    <input
                        v-model="dataInfo.nickname" 
                        class="form-control"></input>
                </div>
            </div>
            <div class="content-group clearfix">
                <div class="label-group clearfix">
                    <span class='float-right'>用户类型：</span>
                </div>
                <div class='input-groups'>
                    <span class="inline_block mr10">
                        <input
                            v-model="dataInfo.accountType"
                            value="1"
                            type="radio" readonly>
                        <span class="inline_block">微信用户</span>
                    </span>
                    <span class="inline_block mr10">
                        <input
                            v-model="dataInfo.accountType"
                            value="2"
                            type="radio" readonly>
                        <span class="inline_block">QQ用户</span>
                    </span>
                    <span class="inline_block mr10">
                        <input
                            v-model="dataInfo.accountType"
                            value="3"
                            type="radio" readonly>
                        <span class="inline_block">手机用户</span>
                    </span>
                </div>
            </div>
            <div class="content-group clearfix">
                <div class="label-group clearfix">
                    <span class='float-right'>性别：</span>
                </div>
                <div class='input-groups'>
                    <span class="inline_block mr10">
                        <input
                            v-model="dataInfo.sex"
                            value="1" 
                            type="radio">
                        <span class="inline_block">男</span>
                    </span>
                    <span class="inline_block mr10">
                        <input
                            v-model="dataInfo.sex"
                            value="2" 
                            type="radio">
                        <span class="inline_block">女</span>
                    </span>
                </div>
            </div>
            <div class="content-group clearfix">
                <div class="label-group clearfix">
                    <span class='float-right'>openId：</span>
                </div>
                <div class='input-groups'>
                    {{dataInfo.openId}}
                </div>
            </div>
            <div class="content-group clearfix">
                <div class="label-group clearfix">
                    <span class='float-right'>unionId：</span>
                </div>
                <div class='input-groups'>
                    {{dataInfo.unionId}}
                </div>
            </div>
            <div class="content-group clearfix">
                <div class="label-group clearfix">
                    <span class='float-right'>电话：</span>
                </div>
                <div class='input-groups'>
                    {{dataInfo.tel}}
                </div>
            </div>
            <div class="content-group clearfix">
                <div class="label-group clearfix">
                    <span class='float-right'>省：</span>
                </div>
                <div class='input-groups'>
                    {{dataInfo.province}}
                </div>
            </div>
            <div class="content-group clearfix">
                <div class="label-group clearfix">
                    <span class='float-right'>市：</span>
                </div>
                <div class='input-groups'>
                    {{dataInfo.city}}
                </div>
            </div>
            <div class="content-group clearfix">
                <table class="table table-bordered table_color">
                    <thead>
                        <tr class="tr_success">
                            <th>房卡数</th>
                            <th>游戏总数</th>
                            <th>胜利数</th>
                            <th>失败数</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>{{userData.roomCardCount}}</td>
                            <td>{{userData.allCount}}</td>
                            <td>{{userData.winCount}}</td>
                            <td>{{userData.loseCount}}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="buttons clear">
            <button
                @click="modifyUserInfo()" 
                class="mr10 btn btn-primary">修改用户</button>
            <button
                @click="modifyUserStatus(1)" 
                class="mr10 btn btn-danger">冻结</button>
            <button
                @click="modifyUserStatus(0)" 
                class="mr10 btn btn-success">解冻</button>
            <button    
                @click="goBack()" 
                class="mr10 btn btn-default">返回</button>
        </div>
    </div>

    
</div>
</template>

<script>
    import page from 'components/page'
    import navBar from 'components/navBar'
    export default {
        components: {
           page,
           navBar,
        },
        data(){
            return {
                dataInfo:{},
                userData:[],
            }
        },
        watch:{
            
        },
        mounted() {
            this.$nextTick(()=>{
                this.getInfo();
            })
        },
        methods:{
            getInfo(){
                util.ajax({
                    url:config.baseApi + 'game-manage/api/user/getUserInfoDetail',
                    data:{
                        uid:this.$route.query.uid
                    },
                    success:(data=>{
                        this.dataInfo = data.data;
                        this.userData = data.data.userData;
                    })
                })
            },
            //冻结/解冻 type1 冻结   tpye0解冻
            modifyUserStatus(isFree){
                let title = '';

                if(isFree == 1){
                    title = '确认冻结该用户？';
                }else{
                    title = '确认解冻该用户？';
                }
                popup.confirm({
                    title:title,
                    yes:()=>{
                        util.ajax({
                            url:config.baseApi + 'game-manage/api/user/modifyUserStatus',
                            data:{
                                uid:this.$route.query.uid, // 是   string  uid
                                isFree:isFree, //  是   string  冻结状态 1-冻结 0-解冻
                            },
                            success:()=>{
                                this.getList();
                            }
                        })
                    }
                })
            },
            //上传图片
            upload(){
                util.cerateFileFormData({
                    url:config.baseApi + 'game-manage/api/user/upload',
                    checktype:['jpg','png','bmp'],
                    filename:'myfiles',
                    success:(data=>{
                        this.dataInfo.headimgurl = data.data;
                    })
                })
                
            },
            //修改用户
            modifyUserInfo(){
                let obj = {
                    uid:this.$route.query.uid, // 是   long    uid
                    headimgurl:this.dataInfo.headimgurl, //  是   string  用户头像名称
                    nickname:this.dataInfo.nickname, //    是   string  用户昵称
                    sex:this.dataInfo.sex, // 是   int 性别，1为男性，2为女性
                }
                if(obj.nickname == ''){
                    popup.alert({title:'请输入用户昵称！'});
                    return;
                }
                util.ajax({
                    url:config.baseApi + 'game-manage/api/user/modifyUserInfo',
                    data:obj,
                    success:(data=>{
                        popup.miss({title:'修改成功！'});
                        router.push({name:'user_list'});
                    })
                })
            }
        }
    }
</script>
